<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>欢迎页面-X-admin2.0</title>
	<base href="/">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="css/font.css">
    <link rel="stylesheet" href="css/xadmin.css">
    <script type="text/javascript" src="lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="js/xadmin.js"></script>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
      <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
      <style>
          .layui-form-item .layui-input-inline {
              width: 300px;
          }
      </style>
  </head>
  <body>
    <div class="x-body">
        <form class="layui-form" id="permissionViewForm">


        </form>
    </div>
    <script>
        $(function(){});

            layui.use(['form','layer'], function(){
                form = layui.form,layer = layui.layer;

                var id=getQueryParam("id");
                var ids=new Array();

                //查询此角色已拥有的权限
                $.ajax({
                    url:'role-permission/'+id,
                    async:false,
                    success:function (res) {
                        if(res.code==200){
                           $.each(res.data.permissionIds,function (index,item) {
                               ids[index]=parseInt(item);
                           });
                        }
                    }
                });


                //初始化元素
                $.ajax({
                   url:'permission-view',
                   type:'GET',
                   success:function (res) {
                       if(res.code==200){
                            $("#permissionViewForm").empty();
                            $.each(res.data.list,function (index,item) {
                                var div=$("<div></div>").addClass("layui-form-item");
                                var label=$("<label></label>").addClass("layui-form-label").append(item.permissionName);
                                var div2=$("<div></div>").addClass("layui-input-block");
                                $.each(item.childpermissions,function(index2,item2) {
                                    var input=$("<input/>").attr("type","checkbox").attr("name","permissionId").attr("title",item2.permissionName).attr("value",item2.permissionId);
                                    //alert("id:"+parseInt(item2.permissionId)+","+ids.indexOf(parseInt(item2.permissionId)));
                                    if(ids.indexOf(parseInt(item2.permissionId))>=0){
                                        input.attr("checked","checked");
                                    }
                                    div2.append(input);
                                });
                                div.append(label).append(div2).appendTo($("#permissionViewForm"));
                            });
                            //添加一个提交按钮
                            var button='        <div class="layui-form-item">\n' +
                                '              <label for="" class="layui-form-label">\n' +
                                '              </label>\n' +
                                '              <button  class="layui-btn" lay-filter="add" lay-submit="">\n' +
                                '                  授权\n' +
                                '              </button>\n' +
                                '          </div>';
                            $("#permissionViewForm").append(button);
                            //数据填充完成，重新渲染表单
                            form.render();
                       }
                   }
                });


                //监听提交
                form.on('submit(add)', function(data){
                      var arrs=$("input[name='permissionId']:checked");
                      var array=new Array();
                      $.each(arrs,function (index) {
                         console.log($(this).val());
                         array[index]=parseInt($(this).val());
                      });
                    console.log(array);
                    $.ajax({
                        url:'role-authorization/'+id,
                        type:'post',
                        data:{permissionIds:array},
                        success:function (res) {
                            if(res.code==200){
                                layer.alert("添加成功", {icon: 6},function () {
                                    // 获得frame索引
                                    var index = parent.layer.getFrameIndex(window.name);
                                    //刷新父页面 去最后一页
                                    parent.initRoleList(parent.$("#pages").val());
                                    //关闭当前frame
                                    parent.layer.close(index);
                                });
                            }else{
                                layer.alert(res.msg, {icon: 5,time:1000});
                            }
                        },
                        error:function (res) {
                            layer.msg("操作失败",{icon:5,time:1000});
                        }
                    });
                    return false;
                });

        });
    </script>
  </body>
</html>